<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Baloon</title>
  <link href="https://fonts.googleapis.com/css?family=Lato:400,700|Open+Sans:700|Roboto:400,900&display=swap"
    rel="stylesheet">
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/slick.css">
  <link rel="stylesheet" href="css/style.css">
  <link rel="stylesheet" href="css/media.css">
</head>

<body>

  <header class="header">
    <div class="container">
      <div class="header_inner">

        <div class="logo">
          <a href="#">
            <img src="images/logo.png" alt="">
          </a>
        </div>

        <nav class="menu">
          <div class="btn__menu">
            <div></div>
            <div></div>
            <div></div>
          </div>
          <ul class="menu__list">
            <li><a href="#">HOME</a></li>
            <li><a href="#">ABOUT US</a></li>
            <li><a href="#">WHMCS-BRIDGE</a></li>
            <li><a href="#">HOSTING</a></li>
            <li><a href="#">PAGES</a></li>
            <li><a href="#">BLOG</a></li>
            <li><a href="#">CONTACT US</a></li>
          </ul>
        </nav>
      </div>
    </div>
  </header>

  <section class="top">
    <div class="container">
      <div class="top__inner">
        <div class="top-info">
          <div class="top-info__subtitle">
            Simple – Easy to use – 10x faster!
          </div>
          <h1 class="top-info__title">
            The Best Web Hosting
          </h1>
          <div class="top-info__descr">
            Starting at $7.99 $3.95/month*
            <span>Enter your website to see how we can help your business grow ...</span>
          </div>
          <ul class="top-info__list">
            <li>FREE Domain</li>
            <li>FREE Site Builders</li>
            <li>1-Click <img src="images/wp-icon.png" alt=""> WordPress Install</li>
            <li>24/7 Support</li>
          </ul>
          <a href="#" class="top-info_btn">
            Get Started Now!
          </a>
          <div class="top-info_btn-descr">
            *Special intro offer and 30-day money-back guarantee
          </div>
        </div>
        <div class="top-images">
          <div class="top-images__box">
            <img src="images/ballon.png" alt="">
            <div class="top-images__circle">
              <div class="top-images__title">Starting at</div>
              <div class="top-images__price">$7.99</div>
              <div class="top-images__date">/month</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>

  <section class="price">
    <div class="container">
      <h2 class="title">
        Pay for what you <span>actually</span> use. No hidden charge!
      </h2>
      <div class="price__descr">
        SEO WP built using Live Composer — a front-end page builder for <a href="#">WordPress</a>. Live Composer is a
        new generation of the
        <a href="#">visual editors</a> for your website. Using simple drag and drop interface you can create any page
        layout. <span>No coding skills
          required</span>
      </div>

      <div class="price__items">

        <div class="price-item">
          <div class="price-item__number">
            €190/<span>mo</span>
          </div>
          <div class="price-item__images">
            <img src="images/price-item1.png" alt="">
          </div>
          <div class="price-item__title">
            Personal
          </div>
          <div class="price-item__text">
            I think your best bet would be to start or join a startup. That’s been a reliable way to get rich for
            hundreds of years.
          </div>
          <ul class="price-item__list">
            <li>10GB Space</li>
            <li>1 Free Domain</li>
            <li>300GB SSD Disk</li>
            <li>Custom domain</li>
          </ul>
          <a href="#" class="price-item__btn">
            Get Started Now
          </a>
        </div>

        <div class="price-item">
          <div class="price-item__number">
            €499/<span>mo</span>
          </div>
          <div class="price-item__images">
            <img src="images/price-item2.png" alt="">
          </div>
          <div class="price-item__title">
            Enterprise
          </div>
          <div class="price-item__text">
            I think your best bet would be to start or join a startup. That’s been a reliable way to get rich for
            hundreds of years.
          </div>
          <ul class="price-item__list">
            <li>20GB Space</li>
            <li>3 Free Domain</li>
            <li>600GB SSD Disk</li>
            <li>Custom domain</li>
          </ul>
          <a href="#" class="price-item__btn">
            Get Started Now
          </a>
        </div>

        <div class="price-item">
          <div class="price-item__number">
            €999/<span>mo</span>
          </div>
          <div class="price-item__images">
            <img src="images/price-item3.png" alt="">
          </div>
          <div class="price-item__title">
            Business
          </div>
          <div class="price-item__text">
            I think your best bet would be to start or join a startup. That’s been a reliable way to get rich for
            hundreds of years.
          </div>
          <ul class="price-item__list">
            <li>30GB Space</li>
            <li>5 Free Domain</li>
            <li>900GB SSD Disk</li>
            <li>Custom domain</li>
          </ul>
          <a href="#" class="price-item__btn">
            Get Started Now
          </a>
        </div>
      </div>
    </div>
  </section>

  <section class="reviews">
    <div class="container">
      <div class="title">
        What <span>People</span> Say About Us
      </div>
      <div class="reviews-slider">

        <div class="reviews-slider__item">
          <div class="reviews-box">
            <div class="reviews-box__images">
              <img src="images/photo1.jpg" alt="">
            </div>
            <div class="reviews-box__content">
              <div class="reviews-box__text">
                There are many variations of passages of Lorem Ipsum available, but the majority have suffered
                alteration in some form,
                by injected humour, or randomised words which don't look even slightly believable.
              </div>
              <div class="reviews-box__author">
                <span>Captain America</span> - unemployed
              </div>
            </div>
          </div>
        </div>

        <div class="reviews-slider__item">
          <div class="reviews-box">
            <div class="reviews-box__images">
              <img src="images/photo2.jpg" alt="">
            </div>
            <div class="reviews-box__content">
              <div class="reviews-box__text">
                There are many variations of passages of Lorem Ipsum available, but the majority have suffered
                alteration
                in some
                form,
                by injected humour, or randomised words which don't look even slightly believable.
              </div>
              <div class="reviews-box__author">
                <span>Tony Stark</span> - CEO Stark Industries
              </div>
            </div>
          </div>
        </div>

        <div class="reviews-slider__item">
          <div class="reviews-box">
            <div class="reviews-box__images">
              <img src="images/photo1.jpg" alt="">
            </div>
            <div class="reviews-box__content">
              <div class="reviews-box__text">
                There are many variations of passages of Lorem Ipsum available, but the majority have suffered
                alteration in some form,
                by injected humour, or randomised words which don't look even slightly believable.
              </div>
              <div class="reviews-box__author">
                <span>Captain America</span> - unemployed
              </div>
            </div>
          </div>
        </div>

        <div class="reviews-slider__item">
          <div class="reviews-box">
            <div class="reviews-box__images">
              <img src="images/photo2.jpg" alt="">
            </div>
            <div class="reviews-box__content">
              <div class="reviews-box__text">
                There are many variations of passages of Lorem Ipsum available, but the majority have suffered
                alteration
                in some
                form,
                by injected humour, or randomised words which don't look even slightly believable.
              </div>
              <div class="reviews-box__author">
                <span>Tony Stark</span> - CEO Stark Industries
              </div>
            </div>
          </div>
        </div>

        <div class="reviews-slider__item">
          <div class="reviews-box">
            <div class="reviews-box__images">
              <img src="images/photo1.jpg" alt="">
            </div>
            <div class="reviews-box__content">
              <div class="reviews-box__text">
                There are many variations of passages of Lorem Ipsum available, but the majority have suffered
                alteration in some form,
                by injected humour, or randomised words which don't look even slightly believable.
              </div>
              <div class="reviews-box__author">
                <span>Captain America</span> - unemployed
              </div>
            </div>
          </div>
        </div>

        <div class="reviews-slider__item">
          <div class="reviews-box">
            <div class="reviews-box__images">
              <img src="images/photo2.jpg" alt="">
            </div>
            <div class="reviews-box__content">
              <div class="reviews-box__text">
                There are many variations of passages of Lorem Ipsum available, but the majority have suffered
                alteration
                in some
                form,
                by injected humour, or randomised words which don't look even slightly believable.
              </div>
              <div class="reviews-box__author">
                <span>Tony Stark</span> - CEO Stark Industries
              </div>
            </div>
          </div>
        </div>

      </div>
    </div>
  </section>

  <section class="partners">
    <div class="continer">
      <div class="partners__inner">
        <div class="partners__images">
          <img src="images/partners.png" alt="">
        </div>
      </div>
    </div>
  </section>

  <footer class="footer">
    <div class="container">
      <div class="footer__inner">
        <div class="footer-col__logo">
          <a href="#" class="footer-logo">
            <img src="images/logo-white.png" alt="">
          </a>
          <div class="footer__text">
            Hosting Website Builder is a big library of pre-designed web elements which help you create website in few
            minutes.
          </div>
        </div>
        <div class="footer-menu">
          <div class="footer_title">Knowledge Base</div>
          <ul class="footer__list">
            <li><a href="#">Tutorials</a></li>
            <li><a href="#">Get Paid to Write</a></li>
            <li><a href="#">Questions</a></li>
            <li><a href="#">Meetups</a></li>
            <li><a href="#">Referral Program</a></li>
            <li><a href="#">Shop</a></li>
            <li><a href="#">Droplets for Demos</a></li>
          </ul>
        </div>
        <div class="footer-menu">
          <div class="footer_title">Company</div>
          <ul class="footer__list">
            <li><a href="#">Hosting.com Blog</a></li>
            <li><a href="#">About Us</a></li>
            <li><a href="#">About Us</a></li>
            <li><a href="#">Terms & Conditions</a></li>
            <li><a href="#">Affiliate Terms & Conditions</a></li>
            <li><a href="#">Privacy Policy</a></li>
          </ul>
        </div>
        <div class="footer-form">
          <div class="footer_title">Quick Contact</div>
          <form>
            <input type="text" placeholder="Name">
            <input type="text" placeholder="Email Address">
            <input type="text" placeholder="Subject">
            <textarea placeholder="Message"></textarea>
            <button type="submit">Send</button>
          </form>
        </div>
      </div>
    </div>
  </footer>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="js/slick.min.js"></script>
  <script src="js/main.js"></script>
</body>

</html>